<template>
  <div class="home">
	  <travelHomeHeader></travelHomeHeader>
	  <travelHomeSwiper></travelHomeSwiper>
	  <travelHomeIconBtn></travelHomeIconBtn>
	  <travelHomeHotActive></travelHomeHotActive>
	  <travelHomeScrollSwiper></travelHomeScrollSwiper>
	  <travelHomeGuess @gotoClick='gotoClick' :moveNum='moveNum'></travelHomeGuess>
	  <travelHomeGuessContent :isNum='isNum' @goY='goY'></travelHomeGuessContent>
	  <travelHomeHotAct></travelHomeHotAct>
  </div>
</template>

<script>
import axios from 'axios'
import travelHomeHeader from './components/travel_homeHeader'
import travelHomeSwiper from './components/travel_homeSwiper'
import travelHomeIconBtn from './components/travel_homeIconBtn'
import travelHomeHotActive from './components/travel_homeHotActive'
import travelHomeScrollSwiper from './components/travel_homeScrollSwiper'
import travelHomeGuess from './components/travel_homeGuess'
import travelHomeGuessContent from './components/travel_homeGuessContent'
import travelHomeHotAct from './components/travel_homeHotAct'
export default {
  name: 'travelHome',
  components:{
	  travelHomeHeader,
	  travelHomeSwiper,
	  travelHomeIconBtn,
	  travelHomeHotActive,
	  travelHomeScrollSwiper,
	  travelHomeGuess,
	  travelHomeGuessContent,
	  travelHomeHotAct
  },
  data(){
	  return{
		  isNum:-1,
		  moveNum:''
	  }
  },
  methods:{
	  gotoClick(e){
		  this.isNum=e
	  },
	  goY(e){
		  this.moveNum=e
	  }
  },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

</style>
<style lang='stylus' scoped>
.home
	width:100%
</style>
